<template>
	<div style="margin-top: 20px;">
		<Row type="flex" justify="end" class="code-row-bg" :gutter="16">
			<Col span="2" style="position: absolute;left: 0;">
			<Button type="primary" icon="ios-arrow-back" @click="goBack()">返回</Button>
			</Col>
			<Col span="3">
			<Select v-model="searchForm.status" filterable placeholder="状态">
				<Option value="" key="">全部</Option>
				<Option v-for="(item,key) in getSearchData.status" :value="key" :key="key">{{ item}} </Option>
			</Select>
			</Col>
			<Col span="2">
			<Button type="primary" icon="ios-search" @click="getTableDataExcute(1)">搜索</Button>
			</Col>
		</Row>
		<br>

		<Row>
			<div class="demo-spin-container" v-if="tableLoading">
				<Spin fix>
					<Icon type="load-c" size=18 class="spin-icon-load"></Icon>
					<div>加载中...</div>
				</Spin>
			</div>
			<Table border :columns="columns" :data="feeds.data" @on-sort-change='onSortChange'></Table>
			<div style="margin: 10px;overflow: hidden">
				<div style="float: right;">
					<Page :total="feeds.record_count" :current="feeds.page_current" :page-size="feeds.page_size" class="paging" show-elevator show-total show-sizer @on-change="handleOnPageChange" @on-page-size-change='onPageSizeChange'></Page>
				</div>
			</div>
		</Row>

		<add-component v-if='addModal.show === true' @on-add-modal-success='getTableDataExcute(1)' @on-add-modal-hide="addModalHide"></add-component>
		<edit-component v-if='editModal.show === true' :modal-id='editModal.id' @on-edit-modal-success='getTableDataExcute(1)' @on-edit-modal-hide="editModalHide"> </edit-component>

	</div>
</template>

<script>
	import {
		getGash,
		getData
	} from '@/api/home'

	export default {
		components: {
		
		},
		data() {
			return {
				getSearchData :{
					status:[]
				},
				searchForm: {
					status:''
				},
				tableLoading: false,
				tableStatus: {
					enable: []
				},
				feeds: {
					data: [],
					record_count: 0,
					page_current: 1,
					page_size: 10
				},
				addModal: {
					show: false
				},
				editModal: {
					show: false,
					id: 0
				},
				columns: [{
						title: 'ID',
						key: 'gcash_id',
						sortable: true,
						width: 100
					},
					{
						title: '头像',
						render: (h, params) => {
							return h('div', [
								h('Avatar', {
									props: {
										icon: 'ios-person',
										size: 'large'
									},
									attrs: {
										src: params.row.head_img,
									},
									on: {
										click: (value) => {}
									}
								}),
							])
						}
					},
					{
						title: '姓名',
						key: 'realname'
					},
					{
						title: '注册账号',
						key:'username'
					},
					{
						title: '提现金额',
						key: 'price'
					},
					{
						title: '提现方式',
						key: 'pay_type_text'
					},
					{
						title: '状态',
						render: (h, params) => {
							let status_text;
							switch(params.row.status){
								case -1:
								 status_text = params.row.status_text + '(理由：'+params.row.un_remark + ')';
								break;
								default:
								status_text = params.row.status_text
								
							}
							return h('div',
							    	status_text
							)
						}
					},
					{
						title: '提现时间',
						key: 'create_time'
					},
					{
						title: '操作',
						render: (h, params) => {
							let t = this;
							return h('div', [
								h('Button', {
									props: {
										type: 'success',
										size: 'small'
									},
									on: {
										click: () => {
											t.$Notice.error({
												title: '请移步至APP进行操作'
											})
										}
									}

								}, '操作'),

							])
						}
					},
				]
			}
		},
		created() {
			let t = this
			t.getTableDataExcute(t.feeds.page_current);
			t.getSearchDataExcute();
		},
		methods: {
			handleOnPageChange: function(page_current) {
				this.getTableDataExcute(page_current)
			},
			onPageSizeChange: function(page_size) {
				this.feeds.page_size = page_size
				this.getTableDataExcute(1)
			},
			getTableDataExcute(page_current) {
				let t = this
				t.tableLoading = true
				t.feeds.page_current = page_current
				getGash(page_current, t.feeds.page_size, t.searchForm).then(res => {
					    	//console.log(res);
					t.feeds.data = res.data.data.list
					//					console.log(t.feeds.data);
					t.feeds.record_count = res.data.data.record_count
					t.tableLoading = false
				}, function(error) {
					t.tableLoading = false
				})
			},
			getSearchDataExcute(){
				let t = this;
				getData().then(res => {
                    //console.log(res);
					t.getSearchData.status = res.data.data.car_user_gcash.status;
				}, function(error) {
					t.tableLoading = false
				})
			},
			onSortChange: function(data) {

			},
			goBack(){
				 this.$router.push({
            		name: 'home'
          		})
			}
		}
	}
</script>